<template>
    <div>
        <v-Header title="提现">
          <div slot="right" class="right">
            <router-link to="/User/TiXianInfo" tag="span">记录</router-link>
          </div>
        </v-Header>
        <v-panel title="提现">
            <v-input title="开户行" value="中国工商银行" disabled></v-input>
            <v-input title="银行卡号" value="6222081803000628209" disabled></v-input>
            <v-input title="账号余额" value="8,2900.00" disabled></v-input>
            <v-input title="可提金额" value="8,2900.00" disabled></v-input>
            <v-input title="提现金额" v-model="jine" placeholder="最多两位小数"></v-input>
            <v-input title="交易密码" v-model="jine" type="password"></v-input>
            <div class="yzm">
              <span>验证码</span>
              <input type="text">
              <img src="../../../assets/logo.png" alt="验证码">
            </div>
        </v-panel>
        <div class="btn">
            <input-button text='确认提现' color='#fb7d3f' @click.native="TiXian"></input-button>
            <input-button text='解绑银行卡' @click.native="$router.push('/User/BangDing');"></input-button>
        </div>

    </div>
</template>

<script>
import vHeader from "../../Common/vHeader";
import vPanel from "../../Common/vPanel";
import vInput from "../../Common/vInput";
import InputButton from "../../Common/InputButton";
export default {
  data() {
    return {
      select: '中国工商银行',
      option:['中国农业银行','中国工商银行','中国邮政储蓄','中国银行','中国建设银行'],
      jine:'',
    }
  },
  components: {
    vHeader,
    vPanel,
    vInput,
    InputButton
  },
  computed: {},
  methods: {
    TiXian() {
      this.$toast("提现失败！");
    }
  }
};
</script>

<style scoped>
.right{
  display: flex;
  justify-content: flex-end;
}
.btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 8vh;
}

.select, .yzm{
  width: 100%;
    border-bottom: 1px solid #E9E9E9;
    border-radius: .5rem;
}
.select>span, .yzm>span{
    display: inline-block;
    width: 30%;
    margin-left: 1rem;
    font-size: 1.1rem;
    line-height: 2.5rem;
}
.select>select,.yzm>input{
    width: 50%;
    height: 1.75rem;
    line-height: 1.5rem;
    font-size: 1rem;
    border: 1px solid #E9E9E9;
    text-indent: .5rem;
    color: #aaaaaa;
    background-color: #fff;
}
.yzm>input{
  width: 25%;
}
.yzm>img{
  height: 1.75rem;
  vertical-align: text-top;
  width: 25%;
}
</style>